<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>我的证书/证书查询</title>
    <link rel="stylesheet" href="https://tstatic.dgg.net/static/plugs/DataTables/css/jquery.dataTables.css">
    <link rel="stylesheet" href="https://tstatic.dgg.net/static/plugs/layui/css/layui.min.css">
    <link rel="stylesheet" href="https://tstatic.dgg.net/static/css/dgg-iboss.min.css">
    <link rel="stylesheet" href="https://tstatic.dgg.net/static/css/dgg-plugs.min.css">
</head>
<body>
<div class="titleSearch">
    <div class="layui-inline">
        <label>所属事业部：</label>
        <div class="layui-input-inline">
            <select class="select-style" name="businessOrganizationId">
                <option>全部</option>
                <option value="1">成都资质事业部</option>
                <option value="2">重庆资质事业部</option>
                <option value="3">广州资质事业部</option>
                <option value="4">北京资质事业部</option>
                <option value="5">武汉资质事业部</option>
                <option value="6">深圳资质事业部</option>
                <option value="7">杭州资质事业部</option>
            </select>
        </div>
    </div>
    <div class="layui-inline">
        <label>出库原因：</label>
        <div class="layui-input-inline">
            <select class="select-style" name="lastFollowRecordContent">
                <option>全部</option>
                <option value="1">人才借用</option>
                <option value="2">单位借用</option>
                <option value="3">退回人才</option>
                <option value="4">商务续签</option>
                <option value="5">后台办理</option>
            </select>
        </div>
    </div>
    <div class="layui-inline">
        <label>类型：</label>
        <div class="layui-input-inline">
            <select class="select-style" name="originType">
                <option>全部</option>
                <option value="1">出库</option>
                <option value="2">入库</option>
                <option value="3">移交</option>
            </select>
        </div>
    </div>
    <div class="layui-inline">
        <label>操作时间：</label>
        <div class="layui-inline">
            <input type="text" name="startDate" placeholder="开始时间" class="Wdate input-style" id="d4311" onfocus="var d4312=$dp.$('d4312'); WdatePicker({onpicked:function(){d4312.focus();}, maxDate:'#F{ $dp.$D(\'d4312\')}', dateFmt:'yyyy-MM-dd'})">
        </div>
        <span>~</span>
        <div class="layui-inline">
            <input type="text" name="endDate" placeholder="结束时间" class="Wdate input-style" id="d4312" onfocus="WdatePicker({minDate:'#F{$dp.$D(\'d4311\')}', dateFmt:'yyyy-MM-dd'})">
        </div>
    </div>
    <div class="layui-inline">
        <label>关键字：</label>
        <div class="layui-input-inline">
            <input type="text" class="input-style win250" placeholder="操作人/领用人/证书系统ID">
        </div>
    </div>
    <div class="layui-inline">
        <button class="layui-btn layui-btn-mini layui-btn-normal">搜索</button>
        <button class="layui-btn layui-btn-mini layui-btn-primary">清空</button>
        <button class="layui-btn layui-btn-mini layui-btn-green">导出</button>
    </div>
</div>
<div class="table-conter">
    <a href="javascript:void(0)" class="layui-btn layui-btn-mini" onclick="sendOn()">转交</a>
</div>
<table id="myTable" class="cell-border crm-table">
</table>
<!--转交 start-->
<div class="content-layer layui-layer-wrap" id="message-layer">
    <div class="layer-tit">
        <div class="remark-input-box">
            <span class="required">转交接收人：</span>
            <select name="" id="userSelect"></select>
        </div>
    </div>
    <div class="layer-body">
        <textarea class="textarea-style template-textarea" rows="5" placeholder="备注"></textarea>
    </div>
</div>
<!--转交 end-->
<script src="https://tstatic.dgg.net/static/plugs/jquery/jquery-1.9.1.min.js"></script>
<script src="https://tstatic.dgg.net/static/plugs/layui/layui.all.js"></script>
<script src="https://tstatic.dgg.net/static/plugs/DataTables/js/jquery.dataTables.js"></script>
<script src="https://tstatic.dgg.net/static/plugs/DataTables/js/dataTables.fixedColumns.min.js"></script>
<script src="https://tstatic.dgg.net/static/plugs/DataTables/js/dataTable.extend.js"></script>
<script src="https://tstatic.dgg.net/static/js/dgg-foot-base.js"></script>
<script src="https://tstatic.dgg.net/static/plugs/date-picker/WdatePicker.js"></script>
<script src="https://tstatic.dgg.net/static/plugs/select2/js/select2.min.js"></script>
<script>
    $(function () {
        $('#myTable').dataTableExtend({
            "ajax": "https://www.easy-mock.com/mock/5b601a98e5570610098cc81f/interface/table.co",
//			    	"select":true,
			    	"scrollX":"true",//是否开启横项滚动
                    "fixedColumns":   {//锁定列，只有开启scrollX时才生效
			            "leftColumns": 4,//左侧锁定2列
			            // "rightColumns": 1//右侧锁定1列
			        },
            "fnServerParams": function (aoData) {
                //搜索条件
                aoData.businessOrganizationId = "wait_allot";
                aoData.lastFollowRecordContent = "0";
            },
            "aoColumns": [
                {
                    "sClass": "check-th",
                    "title":"<input type=\"checkbox\" class=\"checkall\" value=\"undefined\">",
                    "orderable": false,
                    "data": "ID",
                    "render": function (data, type, full, meta) {
                        return '<input type="checkbox"  class="checkchild"  value="' + data + '" />';
                    }
                },
                {
                    "title":"序号",
                    "render": function (data, type, full, meta) {
//			                    console.log(meta.row);
                        return meta.row+1;
                    }
                },
                {
                    "title":"所属事业部",
                    "data": "businessOrganizationId",
                    "orderable": false
                },
                {
                    "title":"证书系统ID",
                    "data": "no",
                    "orderable": false,
                    "render": function (data, type, full, meta) {
                        return '<a href="#" class="iboss-link">'+data+'</a>';
                    }
                },
                {
                    "title":"出库操作人",
                    "data": "createrName",
                    "orderable": false
                },
                {
                    "title":"领用人",
                    "data": "lastFollowRecordUser",
                    "orderable": false
                },
                {
                    "title":"类型",
                    "data": "originType",
                    "orderable": false
                },
                {
                    "title":"操作时间",
                    "data": "createTime",
                    "orderable": false
                },
                {
                    "title":"出入库原因",
                    "data": "lastFollowRecordContent",
                    "orderable": false
                },
                {
                    "title":"备注",
                    "data": "description",
                    "orderable": false
                }
            ],
        });
    });
    function sendOn() {
        dgg.Open({
            title:'转交',
            content:$('#message-layer'),
            area:'400px',
            success:function () {
                $("#userSelect").select2({
                    width:'200px',
                    placeholder: '姓名/工号',
                    allowClear: true,
                    matcher: matchCustom,
                    ajax:{
                        url:"https://www.easy-mock.com/mock/5b601a98e5570610098cc81f/interface/user.do",
                        dataType: 'json',
                        delay: 250,
                        type: 'POST',
                        data: function (params) {
                            // console.log(params)
                            return {
                                q: params.term
                            };
                        },
                        processResults:function (data,params) {
                            // console.log(data.data)
                            return {
                                results: data.data,
                            };
                        },
                        templateSelection: function (data) {
                            // console.log(data)
                            return data.realName;
                        }
                    }
                })
            }
        })
    }
    function matchCustom(params, data) {
        console.log(params)
        // 如果没有搜索项，则返回所有数据。
        if ($.trim(params.term) === '') {
            return data;
        }

        // 如果没有“text”属性，不要显示该项
        if (typeof data.text === 'undefined') {
            return null;
        }
        //`params.term`应该是用于搜索`data.text`的术语，而Y应该是显示数据对象的文本
        if (data.text.indexOf(params.term) > -1) {
            var modifiedData = $.extend({}, data, true);
            modifiedData.text += ' (matched)';

            // 您可以从这里返回修改后的对象
            // 这包括匹配嵌套数据集中的“子数据”
            return modifiedData;
        }

        // 如果不应该显示术语，则返回' null '
        return null;
    }
</script>
</body>
</html>